<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('人员信息')" />
</head>

<body class="gray-bg" style="font: 14px Helvetica Neue, Helvetica, PingFang SC, 微软雅黑, Tahoma, Arial, sans-serif !important;">
    <input id="id" name="id" type="hidden" th:value="${people.id}" />
    <section class="section-content">
    <div class="row">
        <div class="col-sm-3 pr5">
            <div class="ibox float-e-margins">
                <div class="ibox-title ibox-title-gray dashboard-header gray-bg">
                    <h5>人员资料</h5>
                </div>
                <div class="ibox-content">
                    <div class="text-center">
                        <p><img class="img-circle img-lg" th:src="(${user.avatar} == '') ? @{/img/profile.jpg} : @{${user.avatar}}"></p>
                        <p><a href="javascript:avatar()">修改头像</a></p>
                    </div>
                    <ul class="list-group list-group-striped">
                        <li class="list-group-item"><i class="fa fa-user"></i>
                            <b class="font-noraml">姓名：</b>
                            <p class="pull-right">[[${people.name}]]</p>
                        </li>
                        <li class="list-group-item"><i class="fa fa-phone"></i>
                            <b  class="font-noraml">描述：</b>
                            <p class="pull-right">[[${people.description}]]</p>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        
        <div class="col-sm-9 about">
            <div class="ibox float-e-margins">
                <div class="ibox-title ibox-title-gray dashboard-header">
                    <h5>基本资料</h5>
                </div>
                <div class="ibox-content">
                    <div class="nav-tabs-custom">
                        <ul class="nav nav-tabs">
                            <li class="active"><a href="#user_info" data-toggle="tab" aria-expanded="true">基本资料</a></li>
                        </ul>
                        <div class="tab-content">
                            <!--用户信息-->
                            <div class="tab-pane active" id="user_info" th:object="${people}">
                                <form class="form-horizontal" id="form-user-edit">
                                    <!--隐藏ID-->
                                    <input name="id" id="id" type="hidden">
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">姓名：</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="name" th:field="*{name}" placeholder="请输入姓名">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">描述：</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="description" maxlength="11" th:field="*{description}" placeholder="请输入描述">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">权重：</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="symbol" th:field="*{symbol}" placeholder="请输入权重" value="50">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-2 control-label">颜色：</label>
                                        <div class="col-sm-10">
                                            <input type="text" class="form-control" name="color" th:field="*{color}" placeholder="请输入颜色" value="black">
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <div class="col-sm-offset-2 col-sm-10">
                                            <button type="button" class="btn btn-sm btn-primary" onclick="submitPeopleInfo()"><i class="fa fa-check"></i>保 存</button>&nbsp;
                                            <button type="button" class="btn btn-sm btn-danger" onclick="closeItem()"><i class="fa fa-reply-all"></i>关 闭 </button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
	</section>
    
    <th:block th:include="include :: footer" />
    <script>
	    /*用户管理-头像*/
	    function avatar() {
	        var url = ctx + 'people/avatar';
	        $.modal.open("修改头像", url);
	    }
	    
	    /*用户信息-修改*/
	    $("#form-user-edit").validate({
			onkeyup: false,
			rules:{
				name:{
					required:true,
				},
			},
			messages: {
				"name": {
	                required: "请输入人员姓名",
	            },
		    },
		    focusCleanup: true
		});
		
		function submitPeopleInfo() {
	        if ($.validate.form()) {
	        	$.operate.saveModal(ctx + "people/editSave", $('#form-user-edit').serialize());
	        }
	    }
	</script>
</body>
</html>
